import React, { useState } from "react";
import ReactWEditor from "wangeditor-for-react";
import { Button, Space } from "antd";
import "./index.css";

export default () => {
	const [html, setHtml] = useState("");

	const handleHtml = () => {
		console.log(html);
	};

	return (
		<div className="editer">
			<Space direction="vertical">
				<ReactWEditor
					className="content"
					defaultValue={'<h1>Hello Word</h1>'}
					// 插入网络图片的回调事件
					// linkImgCallback={(src, alt, href) => {
					// 	console.log("图片 src ", src);
					// 	console.log("图片文字说明", alt);
					// 	console.log("跳转链接", href);
					// }}
					// 插入网络视频的回调事件
					// onlineVideoCallback={(video) => {
					// 	console.log("插入视频内容", video);
					// }}
					// 编辑器内容改变
					onChange={(html) => {
						setHtml(html);
					}}
					// 光标离开编辑器
					// onBlur={(html) => {
					// 	console.log("onBlur html:", html);
					// }}
					// 光标进入编辑器
					// onFocus={(html) => {
					// 	console.log("onFocus html:", html);
					// }}
				/>
				<Button type="primary" onClick={() => handleHtml()}>
					控制台输出内容
				</Button>
			</Space>
		</div>
	);
};
